<!DOCTYPE html>
<html>
    <head>
        <title>Demo</title>
        <meta charset="utf-8">
        <script src="../../jquery.min.js"></script> 
        <script src="./jquery.steps.js"></script>
    </head>
    <body>
    	
    	<div id="example-basic">
		    <h3>Keyboard</h3>
		    <section>
		        <p>Try the keyboard navigation by clicking arrow left or right!</p>
		    </section>
		    <h3>Effects</h3>
		    <section>
		        <p>Wonderful transition effects.</p>
		    </section>
		    <h3>Pager</h3>
		    <section>
		        <p>The next and previous buttons help you to navigate through your content.</p>
		    </section>
		</div>
    	
    
    
        <script>
	        $("#example-basic").steps({
	            headerTag: "h3",
	            bodyTag: "section",
	            transitionEffect: "slideLeft",
	            autoFocus: true
	        });
        </script>
    </body>
</html>